<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>自助还书-${fns:getConfig('productName')} </title>
    <meta name="viewport"
          content="width=device-width,height=device-height,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=10; IE=11; IE=EDGE">
    <script type="text/javascript">
        var FINAL_COUNT = ${fns:getDictValue('return','selfCountDown' ,'20')}
    </script>
    <%@ include file="/WEB-INF/views/include/common.jsp" %>
    <%@ include file="/WEB-INF/views/include/countDown.jsp" %>
</head>
<body>
<audio src="${ctxStatic}/audio/return.mp3" id="audio1" hidden="true" autoplay="true">
</audio>

<div class="page-header">
    <div class="row">
        <div class="col-md-offset-1 col-md-9">
            <h1>智能图书馆借还系统</h1>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-offset-2 col-md-8">
        <ul class="list-group" style="margin-top: 10%;">
            <li class="list-group-item active" style="height: 50px;"></li>
            <li class="list-group-item">
                <div id="jumbotron" class="jumbotron">
                    <h1 id="gide_div" style="text-align: center">请在条码识别区扫描你要还的图书</h1>
                    <h2 style="text-align: center">请按照语音提示操作</h2>
                </div>
            </li>
        </ul>
    </div>
</div>

<div id="return_content" class="container" style="display: none;">
    <div class="col-md-12">
        <div id="returns_div">
            <table id="contentTable" class="table table-bordered">
                <thead>
                <tr>
                    <th>序号</th>
                    <th>书籍名称</th>
                    <th>ISBN</th>
                    <th>分类号</th>
                    <th>书架号</th>
                    <th>结果</th>
                </tr>
                </thead>
                <tbody id="userReturnBooks">
                </tbody>
            </table>
        </div>
    </div>
</div>

<%@ include file="/WEB-INF/views/include/footer.jsp" %>

<script type="text/javascript">
    var isSubbmit = false;
    var index = 1;
    $(function(){
        document.onkeydown = function (e) {
            var nextCode = '';
            var code = this.code;

            if (window.event) {// IE
                nextCode = e.key
            } else if (e.key) {// Netscape/Firefox/Opera
                nextCode = e.key
            }

            if (nextCode != 'Enter') {
                if (code == undefined) {
                    code = '';
                }
                code += nextCode
            }

            this.code = code;
            // 键入Enter
            if (e.code == 'Enter') {
                // 判断 code 长度
                if (code != undefined && code != '') {
                    code = code.trim();
                    submitBrrowForm(code);
                }
                // 键入回车务必清空code值
                this.code = '';
                return false;
            }
        };
    });

    function submitBrrowForm(banid) {
        // 防止重複提交
        if (!isSubbmit && '' != banid) {
            $("#return_content").show();
            $("#jumbotron").html($("#return_content"));

            isSubbmit = true;
            $.ajax({
                type: "POST",
                url: "${cts}/return_book.do",
                dataType: "json",
                data: {banid: banid},
                success: function (result) {
                    if (null != result) {
                        var code = result.code;
                        var msg = result.msg;
                        if (code == '0001') {
                            var borrow = result.data;

                            var bookname = borrow.bkBookinfo.bookname;//书籍名称
                            var isbn = borrow.bkBookinfo.isbn;//isbn
                            var classcode = borrow.bkBookinfo.classcode;//书籍名称
                            var shelf = borrow.bkBookinfo.bookstore.shelf.name;//书架号

                            var html = "<tr>" +
                                "<td>" + index + "</td>" +
                                "<td>" + bookname + "</td>" +
                                "<td>" + isbn + "</td>" +
                                "<td>" + classcode + "</td>" +
                                "<td>" + shelf + "</td>" +
                                "<td>" + msg + "</td>" +
                                "</tr>";

                            index++;
                            layer.msg(msg);

                            $("#userReturnBooks").append(html);
                        } else {
                            layer.msg(msg);
                        }
                    }
                }, error: function () {
                    $("#banid").val("").focus();
                }
            });
            $("#banid").val("").focus();
            isSubbmit = false;
        }
    }
</script>
</body>
</html>